<template>
  <view>
    <view class="f_row_center" style="padding:30rpx 0">
      <view style="margin: 0 30rpx;">
        <image v-if="isShowImg" :src="url" class="item_img" :lazy-load="true"/>
      </view>

      <view class="f_column flex_1">
        <view class="item_title" :class="[isOneLine!=null&&!isOneLine?'':'text_overflow']">{{ name }}</view>
        <view style="margin-top: 12rpx" class="f_row_center">
<!--          <div class="item_text" style="margin-left: 0" v-html="content"></div>-->
          <item-content-view class="item_text"  style="margin-left: 0" :list="content" />
        </view>
      </view>
      <view style="margin: 0 30rpx">
        <image v-if="isShowArrow" src="/static/arrow_right.png" style="height:30rpx;width:18rpx;"/>
      </view>
    </view>
    <view class="h_line" style="margin: 0rpx 30rpx"/>
  </view>
</template>

<script lang="ts">
import {Vue, Component, Prop} from "vue-property-decorator";
import BaseApi from "@/api/BaseApi";
import ItemContentView from "@/pages/data/components/item_content_view.vue";

@Component({
  components: {
    ItemContentView,
  }
})
export default class ItemDataHouseView extends Vue {
  @Prop() item: any;
  @Prop() name?:any;
  @Prop() content?:any;
  @Prop() isOneLine?:boolean;
  @Prop({default:true}) isShowArrow?:boolean;
  @Prop({default:true}) isShowImg?:boolean;
  get url(){
    return (this.item.tpList??[]).length>0?(this.item.tpList??[])[0].url:''
  }

}
</script>

<style scoped>
.item_img {
  height: 154rpx;
  width: 219rpx;
  border-radius: 10rpx;
  background: #f8f8f8;
  background: url("@/static/no_img.png") no-repeat;
  background-size: 100% 100%;
  background-color: rgba(69, 117, 242, 0.1);
}

</style>